<!DOCTYPE html>
<html>
<head>
<!--script type='text/javascript' src='js/Sirtrack.js'></script-->
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />

<script src="js/jquery-2.1.4.min.js"></script>
<!--script type='text/javascript' src='http://getfirebug.com/releases/lite/latest/firebug-lite-debug.js'-->
<script type='text/javascript' src='js/firebug-lite/firebug-lite-debug.js'>
{
    startOpened: false,
    enableTrace: true,
    //overrideConsole: false,
    //enablePersistent: true,
    saveCommandLineHistory: true,
   // saveWindowPosition: true,
}
</script>
<script type='text/javascript' src="bootstrap/js/bootstrap.js"></script>
<link rel="stylesheet" href="leaflet-0.7.2/leaflet.css" />
    <style type="text/css">
        html, body {
            height: 100%;
            margin: 0;
        }
        #map { 
        	margin: 1em auto;
        	height:70%;
            min-height: 100%; 
        }
    </style>
<script type='text/javascript' src="leaflet-0.7.2/leaflet-src.js"></script>
</head>
<body data-bind="Model">

  <div class="container">
    <nav class="navbar navbar-default">
      <div class="navbar-header">
        <em class="navbar-brand active" href="#" >goGPS_FX <span data-bind="text: p().version"/></em>
      </div>
      <div>
        <ul class="nav navbar-nav">
          <li><a href="index.html">Reload Page</a></li>
          <li><a data-bind="click: getPorts" href="#">Refresh Port List</a></li>
          <li><a data-bind="click: running()? stop : start, text:  running()? 'stop!' : 'go!' " href="#"><em>go!</em></a></li>
        </ul>
      </div>
    </nav>
    <div class="table">
      <div class="row table-bordered">
        <div class="col-sm-1">
            <h4>Mode</h4>
        </div>
          <div class="col-sm-4">
              <select class="form-control" data-bind="options: runModes, optionsText: 'name', optionsValue: 'value', value: p().runMode" ></select>
          </div>
          <div class="col-sm-1"></div>
          <div class="col-sm-3" data-bind="if: p().runMode() > 0 && p().runMode() < 10">
              <h4>Dynamic Model</h4>
          </div>
          <div class="col-sm-3" data-bind="if: p().runMode() > 0 && p().runMode() < 10 ">
              <select class="form-control" data-bind="options: dynModels, optionsText: 'name', optionsValue: 'value', value: p().dynModel"></select>
        </div>
      </div>
      <div class="row  table-bordered">
          <div class="col-sm-5">
            <h4>Rover</h4>
          </div>
          <div class="col-sm-7">
            <div data-bind="foreach: observationProducers">
                <div class="row table-bordered">
                  <div class="col-sm-1">
                    <input type="radio" data-bind="checkedValue: $data, checked: $root.p().observationProducer" />
                  </div>
                  <div class="col-sm-4 other">
                    <span data-bind="text: name"></span>
                 </div>
                <div class="col-sm-4" data-bind="if: $root.ports().length>0 && type()=='serial'">
                     <select class="form-control" data-bind="options: $root.ports, optionsText: 'friendlyName', value: serialPort"></select>
                </div>
                <div class="col-sm-3" data-bind="if: $root.ports().length>0 && type()=='serial'">
                    <select class="form-control" data-bind="options: $root.speedOptions, value: $data.serialPort().speed"></select>
                </div>
                <div class="col-sm-7" data-bind="if: type()=='file'">
                    <input class="form-control" data-bind="textInput: filename"></input>
                </div>
               </div>  
             </div>
          </div>
      </div>
      <div class="row  table-bordered">
          <div class="col-sm-5">
            <h4>Navigation</h4>
          </div>
          <div class="col-sm-7">
            <div data-bind="foreach: navigationProducers">
                <div class="row  table-bordered">
                  <div class="col-sm-1">
                    <input type="radio" data-bind="checkedValue: $data, checked: $root.p().navigationProducer" />
                  </div>
                  <div class="col-sm-4 other">
                    <span data-bind="text: name"></span>
                 </div>
                <div class="col-sm-4" data-bind="if: $root.ports().length>0 && type()=='serial'">
                     <select class="form-control" data-bind="options: $root.ports, optionsText: 'friendlyName', value: serialPort"></select>
                </div>
                 <div class="col-sm-3" data-bind="if: $root.ports().length>0 && type()=='serial'">
                    <select class="form-control" data-bind="options: $root.speedOptions, value: $data.serialPort().speed"></select>
                 </div>
                 <div class="col-sm-7" data-bind="if: type()=='file'">
                    <input class="form-control" data-bind="textInput: filename"></input>
                </div>                 
                <div class="col-sm-7" data-bind="if: type()=='ftp'">
                	<select class="form-control" data-bind="options: $root.ftpSites, optionsText: 'name', value: $root.p().navigationProducer().ftpSite"></select>
                </div>
             </div>
           </div>
          </div>
     </div>
      <div class="row  table-bordered"  data-bind="if: p().runMode() > 0 && p().runMode() < 10">
          <div class="col-sm-5">
            <h4>Master Station</h4>
          </div>
          <div class="col-sm-7">
            <div data-bind="foreach: masterProducers">
                <div class="row  table-bordered">
                  <div class="col-sm-1">
                    <input type="radio" data-bind="checkedValue: $data, checked: $root.p().masterProducer" />
                  </div>
                  <div class="col-sm-4 other">
                    <span data-bind="text: name"></span>
                 </div>
                <div class="col-sm-4" data-bind="if: type()=='serial'">
                     <select class="form-control" data-bind="options: $root.ports, optionsText: 'friendlyName', value: serialPort"></select>
                </div>
                 <div class="col-sm-3" data-bind="if: type()=='serial'">
                    <select class="form-control" data-bind="options: $root.speedOptions, value: $data.serialPort().speed"></select>
                 </div>
                 <div class="col-sm-7" data-bind="if: type()=='file'">
                    <input class="form-control" data-bind="textInput: filename"></input>
                </div>                 
                <div class="col-sm-5" data-bind="if: type()=='ftp'">
                    GARNER_NAVIGATION_AUTO
                </div>
             </div>
           </div>
          </div>
     </div>
       <div class="row  table-bordered">
          <div class="col-sm-2">
            <h4>Output Folder</h4>
          </div>
          <div class="col-sm-2">
              <input class="form-control" data-bind="textInput: p().outputFolder"></input>
          </div>
       </div>     
       <div class="row ">
         <div class="col-sm-2">
            <div data-bind="foreach: satellites">
                <div class="row  table-bordered" data-bind="if: $data && $data.id">
                    <div class="col-sm-1">G<span data-bind="text: id()"></span></div>
                    <div class="col-sm-1"><span data-bind="text: SNR()"></span></div>
                </div>
            </div>
         </div>
       </div>     
   </div>
  </div>
  <div id="map"></div>
</html>
